.btn {
  min-width: 120px;
  height: 35px;
  border-radius: 3px;
  font-size: 13px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  padding-left: 15px;
  padding-right: 15px;
}

.btn-primary {
  color: #fdfdfe;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2);
  border: solid 1px var(--blue-darken-62);
  background-color: var(--blue-base-65);

  &:hover {
    border: solid 1px var(--blue-darken-55);
    background-color: var(--blue-darken-62);
  }

  &:active {
    border: solid 1px var(--blue-darken-48);
    background-color: var(--blue-darken-55);
  }

  &:disabled {
    box-shadow: none;
    border: solid 1px var(--blue-lighten-82);
    background-color: var(--blue-lighten-75);
    color: rgba(253, 253, 254, 0.8);
  }
}

.btn-secondary {
  color: var(--grey-darken-33);
  box-shadow: 0 2px 2px 0 var(--color-000000-opacity-10);
  border: solid 1px var(--silver-darken-80);
  background-color: var(--silver-base-97);

  &:hover {
    background-color: var(--silver-darken-94);
  }

  &:active {
    background-color: var(--silver-darken-87);
  }

  &:disabled {
    box-shadow: none;
    border: solid 1px var(--silver-darken-87);
    background-color: var(--silver-base-97);
    color: var(--color-535353-opacity-50);
  }

}

.btn + .btn {
  margin-left: 15px;
}
